package io.gitee.jingtuo.android.device.ui.splash

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.lifecycle.viewmodel.compose.viewModel
import io.gitee.jingtuo.android.device.R

@Preview
@Composable
fun SplashPage(viewModel: SplashViewModel = viewModel(),
               initComplete: () -> Unit) {
    val uiState = viewModel.uiState().collectAsState()
    Scaffold { innerPadding ->
        ConstraintLayout(
            modifier = Modifier
                .fillMaxHeight()
                .fillMaxWidth()
                .padding(innerPadding),
        ) {
            val (logoId, progressId, textId) = createRefs()
            val topGuideLine = createGuidelineFromTop(0.3F)
            val bottomGuideLine = createGuidelineFromBottom(0.2F)
            Image(
                painter = painterResource(R.drawable.app_logo),
                contentDescription = stringResource(R.string.app_logo),
                modifier = Modifier
                    .size(96.dp)
                    .constrainAs(logoId) {
                        top.linkTo(topGuideLine)
                        start.linkTo(parent.start)
                        end.linkTo(parent.end)
                    }
            )
            if (uiState.value.initializing) {
                CircularProgressIndicator(
                    modifier = Modifier
                        .width(32.dp)
                        .constrainAs(progressId) {
                            bottom.linkTo(textId.top, margin = 10.dp)
                            start.linkTo(parent.start)
                            end.linkTo(parent.end)
                        },
                    color = MaterialTheme.colorScheme.primary,
                    trackColor = MaterialTheme.colorScheme.surfaceVariant,
                )
                Text(
                    text = stringResource(R.string.initializing),
                    modifier = Modifier.constrainAs(textId) {
                        top.linkTo(bottomGuideLine)
                        start.linkTo(parent.start)
                        end.linkTo(parent.end)
                    })
                viewModel.init(LocalContext.current)
            } else {
                initComplete()
            }
        }
    }
}